<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>徐志鹏的音乐播放器 - 学号：23215220318</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <div class="player-container">
        <div class="player-header">
            <h1>徐志鹏的音乐播放器</h1>
            <p>学号：23215220318</p>
        </div>
        
        <div class="player-main">
            <div class="cover">
                <img id="cover-img" src="images/default-cover.jpg" alt="专辑封面">
            </div>
            
            <div class="song-info">
                <h2 id="song-title">歌曲标题</h2>
                <p id="song-artist">艺术家</p>
            </div>
            
            <div class="progress-container">
                <input type="range" id="progress-bar" min="0" max="100" value="0">
                <div class="time-display">
                    <span id="current-time">00:00</span>
                    <span id="duration">00:00</span>
                </div>
            </div>
            
            <div class="controls">
                <button id="prev-btn">上一曲</button>
                <button id="play-btn">播放</button>
                <button id="next-btn">下一曲</button>
            </div>
        </div>
        
        <div class="playlist">
            <h3>播放列表</h3>
            <ul id="song-list">
                <!-- 歌曲列表将通过JS动态生成 -->
            </ul>
        </div>
    </div>
    
    <audio id="audio-player"></audio>
    
    <script src="script.js"></script>
</body>
</html>